<template>
    <div>
        <div class="nav-hader">
            <el-page-header @back="goBack"></el-page-header>
            <el-radio-group v-model="formData.visionDemandDominantType" size="small" >
                <template v-for="item in VisionDemandDominantTypeList">
                    <el-radio-button
                        v-if="formData.visionDemandDominantType == item.key && formData.visionDemandId"
                        :label="item.key"
                        :key="item.key"
                    >{{item.value}}</el-radio-button>
                    <el-radio-button
                        v-if="!formData.visionDemandId"
                        :label="item.key"
                        :key="item.key"
                    >{{item.value}}</el-radio-button>
                </template>
            </el-radio-group>
        </div>
        <vision-design v-if="formData.visionDemandDominantType == 2" ref="visionDesign"></vision-design>
        <vision-demand  v-else></vision-demand>
    </div>
</template>
<script>
const ERR_OK = 200;
import visionDesign from "./vision-design";
import visionDemand from "./vision-demand";
export default {
    data() {
        return {
            VisionDemandDominantTypeList: [],
            formData: { visionDemandDominantType: "1" },
            loading: false
        };
    },
    created() {
        this.getVisionDemandDominantTypeList();
        if (this.$route.query.visionDemandId) {
            this.formData = this.$route.query;
        }
    },
    methods: {
        //获取视觉需求主导类型列表
        getVisionDemandDominantTypeList() {
            this.$ajax
                .get(
                    this.GLOBAL.oaVisionDemand +
                        "/visionDemandBasicInfo/getVisionDemandDominantTypeList"
                )
                .then(res => {
                    if (res.data.code === ERR_OK) {
                        this.VisionDemandDominantTypeList = res.data.data;
                    }
                });
        },
        goBack() {
            this.$router.push({ path: "/OACenter/visualDesign/demandList" });
        }
    },
    components: {
        visionDesign,
        visionDemand
    }
};
</script>
<style lang="stylus" scoped>
.nav-hader {
    margin-bottom: 10px;

    .el-page-header {
        display: inline-block;
        margin-top: 3px;
        vertical-align: top;
        color: #333;
    }

    .button {
        display: inline-block;
        vertical-align: top;

        .el-button {
            margin: 0;
        }
    }
}
</style>
